﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="MaxUploadFile.aspx.cs" Inherits="Sl.Upload.WebTest.MaxUploadFile" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
    <script src="scripts/jquery-2.2.3.min.js"></script>
    <link href="webuploader-0.1.5/webuploader.css" rel="stylesheet" />
    <script src="webuploader-0.1.5/webuploader.nolog.js"></script>
</head>
<body>
    <form id="form1" runat="server">
        <div id="uploader-demo">
            <!--用来存放item-->
            <div id="fileList" class="uploader-list"></div>
            <div id="filePicker">选择图片</div>
        </div>
        <ul id="ufilelist">
            <%--<li><span style="float:right">100%</span><label>文件</label></li>
            <li><span style="float:right">100%</span><label>文件</label></li>--%>
        </ul>
    </form>
    <script>
        var isChunked = true;
        var count = 0;
        var fileCount = 0;
        var fileArr = [];
        var isUpload = false;
        var isfilesQueued = true;
        var uploader = WebUploader.create({
            // 选完文件后，是否自动上传。
            auto: false,
            // swf文件路径
            swf: '/webuploader-0.1.5/Uploader.swf',
            // 文件接收服务端。
            server: 'http://localhost:16666/fileupload.axd',
            // 选择文件的按钮。可选。
            // 内部根据当前运行是创建，可能是input元素，也可能是flash.
            pick: '#filePicker',
            chunked: isChunked,//开启分片上传
            threads: 3,
            // 只允许选择图片文件。
            accept: {
                extensions: 'mp4,rmvb,mkv,docx',
                mimeTypes: 'video/mp4,video/rmvb,video/mkv,document/docx'
            },
            formData: { "OnlyId": 1, "uploadType": "avatar" }
        });
        //uploader.on('fileQueued', function (file) {
        //    file.setStatus("inited")
        //    console.log(file);
        //    uploader.md5File(file, 0, (file.size / 2)).progress(function (percentage) {
        //        console.log('Percentage:', percentage);
        //    }).then(function (val) {
        //        uploader.option("formData", { guid: val });
        //        file.guid = val;
        //        uploader.upload(file);
        //    });
        //});
        uploader.on('filesQueued', function (files) {
            console.log(files);
            console.log(files.length);
            var m = fileCount;
            fileCount += files.length;
            for (var i = 0; i < files.length; i++) {
                files[i].Status = 0;
                fileArr.push(files[i]);
                $("#ufilelist").append('<li id="' + files[i].id + '"><span style="float:right">等待上传</span><label>' + files[i].name + '</label></li>');
            }
            if (isfilesQueued || m == count) {
                Upload();
                isfilesQueued = false;
            }
            //uploader.md5File(file, 0, (file.size / 2)).progress(function (percentage) {
            //    console.log('Percentage:', percentage);
            //}).then(function (val) {
            //    uploader.option("formData", { guid: val });
            //    file.guid = val;
            //    uploader.upload(file);
            //});
        });

        function IsVar(file) {
            console.log(file);
            uploader.md5File(file, 0, (file.size / 2)).progress(function (percentage) {
                $("#" + file.id + ">span").html("验证文件:" + parseInt(percentage * 100));
            }).then(function (val) {
                $("#" + file.id + ">span").html("上传");
                uploader.option("formData", { guid: val });
                file.guid = val;
                uploader.upload(file);
            });
        }

        function Upload() {
            IsVar(fileArr[count]);
        }

        uploader.on('uploadSuccess', function (file, response) {
            console.log(file.Status);
            console.log(file, "uploadSuccess");
            $.ajax({
                type: 'POST',
                url: 'http://localhost:16666/fileupload.axd',
                data: { command: 2, uploadType: "avatar", guid: file.guid, OnlyId: 1, name: file.name },
                success: function (data) {
                    count++;
                    if (fileCount > count)
                        Upload()
                }
            });
        });
        //uploader.on('uploadComplete', function (file, response) {
        //    console.log(file, "uploadComplete");
        //});


        //uploader.on('uploadBeforeSend', function (object, data, headers) {
        //    if (isChunked) {
        //        console.log(object, data, headers);

        //    }
        //    if (beforeCount == 0) {
        //        console.log(beforeCount + "");
        //        data.guid = "FDSAFDSAEWVCFEWAFDS";
        //        //(new WebUploader.Uploader()).md5File(object.file, 0, (object.total / 2)).progress(function (percentage) {
        //        //    console.log("文件读取中:" + percentage)
        //        //}).then(function (val) {
        //        //    data.guid = val;
        //        //    alert(data.guid);
        //        //    //$('#' + file.id).find("p.state").text("成功获取文件信息...");
        //        //    //fileMd5 = val;
        //        //    ////获取文件信息后进入下一步  
        //        //    //deferred.resolve();
        //        //});
        //        beforeCount++;
        //    }
        //    //console.log(object, data, headers);
        //});

        //uploader.on('before-send-file', function (file) {
        //    console.log(file);
        //});
        //WebUploader.Uploader.register({ "before-send-file": "beforeSendFile" }, {
        //    beforeSendFile: function (file) {
        //        console.log(file);
        //    }
        //});

        //alert(uploader.Uploader.register);
    </script>
</body>
</html>
